@reference "../../../../styles/index.css";

.slidingPanelCloseButton {
  @apply absolute
    top-2
    right-6
    z-20
    cursor-pointer
    rounded-full
    p-2
    text-neutral-700
    duration-300
    hover:bg-white/20
    focus:bg-white/20
    focus:outline-none
    motion-safe:transition-colors
    dark:text-white;

  svg {
    @apply size-5;
  }
}

.slidingPanelContentWrapper {
  @apply fixed
    bottom-0
    left-0
    box-border
    h-[95vh]
    w-full
    justify-self-center
    overflow-hidden
    rounded-lg
    border
    border-neutral-300
    bg-white
    p-0
    text-white
    duration-300
    motion-safe:ease-in-out
    dark:border-neutral-900
    dark:bg-zinc-950;
}

.slidingPanelInner {
  @apply relative
    mx-auto
    flex
    h-full
    max-w-4xl
    flex-col
    justify-between
    py-6;
}

.slidingPanelBottom {
  @apply relative;
}
